<template>
  <Header></Header>
    <Drawer></Drawer>
    <el-breadcrumb separator="/" style="font-size: 20px;color: #2AB28B;">
    <el-breadcrumb-item :to="{ path: '/Home' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item :to="{ path: '/Home' }">{{ labName }}</el-breadcrumb-item>
    <el-breadcrumb-item :to="{ path: '/pageList/'+ids }">档案管理</el-breadcrumb-item>
    <el-breadcrumb-item>新建档案</el-breadcrumb-item>
  </el-breadcrumb>

  <div class = 'pageListBotton'>
    <el-button :icon="Expand" style="color: white;background: #2AB28B" round @click="pageList">
      档案列表
    </el-button>


    <span class="onBtnRight"  @click="onHome"><img src="../assets/img/pageList_qiehuan.png" alt=""> 更换群体</span>
  </div>

  <div class="tabInfo">
    <el-tabs v-model="activeName" >
      <el-tab-pane label="基本信息（必填）" name="one">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">基本信息 <span :style="{'color': 'red'}">（必填）</span></div>
          </div>
          <el-form-item label="* 监护人手机号">
            <el-input v-model="formInline.guardian_mobile" placeholder="监护人手机号必填"></el-input>
          </el-form-item>
          <el-form-item label="* 性别">
            <el-radio-group v-model="formInline.sex">
              <el-radio label="男">男</el-radio>
              <el-radio label="女">女</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="* 出生日期">
            <el-config-provider :locale="zhCn">
              <el-date-picker
                  v-model="formInline.birth"
                  type="date"
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                  placeholder="选择日期" :style="{'width':'100%'}">
              </el-date-picker>
            </el-config-provider>
          </el-form-item>
          <el-form-item label="* 孩子姓名">
            <el-input v-model="formInline.username" placeholder="孩子姓名必填"></el-input>

          </el-form-item>
          <el-form-item label="* 体重">
            <el-input v-model="formInline.weight" placeholder="请输入体重" >
              <template #append>kg</template>
            </el-input>
          </el-form-item>
          <el-form-item label="* 头围">
            <el-input v-model="formInline.touwei" placeholder="请输入头围">
              <template #append>cm</template>
            </el-input>
          </el-form-item>

          <el-form-item label="* 身高/身长">
            <el-input v-model="formInline.height" placeholder="请输入身高/身长">
              <template #append>cm</template>
            </el-input>
          </el-form-item>
          <el-form-item label="* 监护人姓名">
            <el-input v-model="formInline.guardian_name" placeholder="请输入监护人姓名">
            </el-input>
          </el-form-item>
          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">其他信息 <span :style="{'color': '#909399'}">（选填）</span></div>
          </div>
          <el-form-item label="出生体重">
            <el-input v-model="formInline.chushengtz" placeholder="请输入出生体重">
              <template #append>kg</template>
            </el-input>
          </el-form-item>
          <el-form-item label="出生身高/身长">
            <el-input v-model="formInline.chushengsg" placeholder="请输入出生身高/身长">
              <template #append>cm</template>
            </el-input>
          </el-form-item>
          <el-form-item label="腹围">
            <el-input v-model="formInline.fuwei" placeholder="请输入腹围">
              <template #append>cm</template>
            </el-input>
          </el-form-item>
          <el-form-item label="血型">
            <el-select v-model="formInline.xuexing_value" placeholder="请选择血型">
              <el-option
                  v-for="item in Default.bloodGroup"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="民族">
            <el-select v-model="formInline.minzu_value" placeholder="请选择民族">
              <el-option
                  v-for="item in Default.nation"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="与监护人关系">
            <el-select v-model="formInline.guanxi_value" placeholder="请选择与监护人关系">
              <el-option
                  v-for="item in Default.relation"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="家长受教育程度">
            <el-select v-model="formInline.jiaoyu_value" placeholder="请选择家长受教育程度">
              <el-option
                  v-for="item in Default.education"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="出生情况">
            <el-select v-model="formInline.birthSituation_value" placeholder="请选择出生情况">
              <el-option
                  v-for="item in Default.birthSituation"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="妊娠不良习惯" style="font-size:30px">
            <el-checkbox-group v-model="formInline.Bad_value" >
              <el-checkbox v-for="item in Default.Bad" :label="item.label" ></el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <div>
            <el-form-item label="妊娠疾病情况" style="font-size:30px">
              <el-checkbox-group v-model="formInline.disease_value" >
                <el-checkbox v-for="item in Default.disease" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div class="next">
            <el-button type="success" @click="onNext('two')">保存并下一步</el-button>
          </div>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="主诉与病史（选填）" name="two">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <div class="bar">
          <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">孩子临床表现 <span :style="{'color': '#909399'}">（选填）</span></div>
        </div>

          <div>
            <el-form-item label="头发" >
              <el-checkbox-group v-model="formInline.hair_value" >
                <el-checkbox v-for="item in Default.hair" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="眼睛" >
              <el-checkbox-group v-model="formInline.eye_value" >
                <el-checkbox v-for="item in Default.eye" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="皮肤" >
              <el-checkbox-group v-model="formInline.skin_value" >
                <el-checkbox v-for="item in Default.skin" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="口腔" >
              <el-checkbox-group v-model="formInline.oralCavity_value" >
                <el-checkbox v-for="item in Default.oralCavity" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="牙齿" >
              <el-checkbox-group v-model="formInline.tooth_value" >
                <el-checkbox v-for="item in Default.tooth" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="颈部" >
              <el-checkbox-group v-model="formInline.neck_value" >
                <el-checkbox v-for="item in Default.neck" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="神经病变" >
              <el-checkbox-group v-model="formInline.Neuropathy_value" >
                <el-checkbox v-for="item in Default.Neuropathy" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="神经症状" >
              <el-checkbox-group v-model="formInline.symptoms_value" >
                <el-checkbox v-for="item in Default.symptoms" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="体征" >
              <el-checkbox-group v-model="formInline.sign_value" >
                <el-checkbox v-for="item in Default.sign" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div>
            <el-form-item label="骨骼" >
              <el-checkbox-group v-model="formInline.bones_value" >
                <el-checkbox v-for="item in Default.bones" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
           <div>
            <el-form-item label="苯丙酮尿症" >
              <el-checkbox-group v-model="formInline.Phenylketonuria" >
                <el-checkbox v-for="item in Default.Phenylketonuria" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">既往病史 <span :style="{'color': '#909399'}">（选填）</span></div>
          </div>

          <el-input
              type="textarea"
              placeholder="如有病史请在这里填写"
              v-model="formInline.history"
              maxlength="1000"
              show-word-limit
          >
          </el-input>
          <div class="next">
            <el-button type="success" @click="onNext('one')">上一步</el-button>
            <el-button type="success" @click="onNext('three')">保存并下一步</el-button>
          </div>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="膳食与过敏（选填）" name="three">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <div class="bar">
          <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">膳食调查 <span :style="{'color': '#909399'}">（选填）</span></div>
        </div>
        <div>
          <el-form-item label="喂养方式" style="width: auto">
            <el-radio-group v-model="formInline.feed_value" style="width: auto">
              <el-radio v-for="item in Default.feed" :label="item.label" ></el-radio>
            </el-radio-group>
          </el-form-item>
        </div>

        <el-form-item label="母乳喂养量"  v-if="formInline.feed_value =='母乳喂养'  || formInline.feed_value =='混合喂养' ">
          <el-input v-model="formInline.BreastfeedingVolume" placeholder="请输入母乳喂养量">
          </el-input>
        </el-form-item>

        <el-form-item label="奶粉喂养量"   v-if="formInline.feed_value =='人工喂养' || formInline.feed_value =='混合喂养' ">
          <el-input v-model="formInline.milkPowderVolume" placeholder="请输入奶粉喂养量">
          </el-input>
        </el-form-item>

        <el-form-item label="配方奶粉品牌" v-if="formInline.feed_value =='人工喂养' || formInline.feed_value =='混合喂养'">
          <el-select v-model="formInline.milkPowder_value" placeholder="请选择配方奶粉品牌"  v-if="formInline.feed_value =='人工喂养' || formInline.feed_value =='混合喂养'">
            <el-option
                v-for="item in Default.milkPowder"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>

          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">食物过敏 <span :style="{'color': '#909399'}">（选填）</span></div>
          </div>

          <div>
            <el-form-item label="过敏食物" >
              <el-checkbox-group v-model="formInline.allergy_value" >
                <el-checkbox v-for="item in Default.allergy" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>

          <div>
            <el-form-item label="食物不耐受" >
              <el-checkbox-group v-model="formInline.intolerance_value" >
                <el-checkbox v-for="item in Default.intolerance" :label="item.label" ></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div class="next">
            <el-button type="success" @click="onNext('two')">上一步</el-button>
            <el-button type="success" @click="onNext('four')">保存并下一步</el-button>
          </div>
        </el-form>

      </el-tab-pane>
      <el-tab-pane label="运动调查（选填）" name="four">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">0~2岁（0~24个月）<span :style="{'color': '#909399'}">（选填）</span></div>
          </div>

          <el-form-item label="运动情况">
            <el-select v-model="formInline.one_motion_value" placeholder="请选择运动情况">
              <el-option
                  v-for="item in Default.one_motion"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">2-6岁（24-72个月）<span :style="{'color': '#909399'}">（选填）</span></div>
          </div>

          <el-form-item label="运动情况">
            <el-select v-model="formInline.two_motion_value" placeholder="请选择运动情况">
              <el-option
                  v-for="item in Default.two_motion"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <div class="bar">
            <div class="w_j" :style="{'color': '#2AB28B','padding':'40px 0 20px 0'}">6-18岁（大于72个月）<span :style="{'color': '#909399'}">（选填）</span></div>
          </div>

          <el-form-item label="运动情况">
            <el-select v-model="formInline.three_motion_value" placeholder="请选择运动情况">
              <el-option
                  v-for="item in Default.three_motion"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <div class="next">
            <el-button type="success" @click="onNext('three')">上一步</el-button>
            <el-button type="success" @click="onNext('five')">保存并下一步</el-button>
          </div>
        </el-form>
      </el-tab-pane>

       <el-tab-pane label="高危儿（选填）" name="five">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">

          <div>
               <el-form-item label="育龄(周)">
              <el-checkbox-group v-model="formInline.childbearing_age" >
               <el-input v-model="formInline.childbearing_age" placeholder="请输入育龄">周
                </el-input>
              </el-checkbox-group>
            </el-form-item>
               <el-form-item label="出生体重(克)">
              <el-checkbox-group v-model="formInline.birth_weight" >
               <el-input v-model="formInline.birth_weight" placeholder="请输入出生体重">克
                </el-input>
              </el-checkbox-group>
            </el-form-item>
               <el-form-item label="巨大儿">
            <el-select v-model="formInline.Gigantic" placeholder="是否为巨大儿">
              <el-option
                  v-for="item in Default.Gigantic"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
               <el-form-item label="阿普加评分(分)">
              <el-checkbox-group v-model="formInline.Apgar_score" >
               <el-input v-model="formInline.Apgar_score" placeholder="请输入阿普加评分">克
                </el-input>
              </el-checkbox-group>
            </el-form-item>
             <el-form-item label="产时是否感染">
            <el-select v-model="formInline.Infected" placeholder="是否感染">
              <el-option
                  v-for="item in Default.Infected"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

             <el-form-item label="是否为高危孕妇">
            <el-select v-model="formInline.high_risk" placeholder="是否为高危孕妇">
              <el-option
                  v-for="item in Default.high_risk"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

             <el-form-item label="手术产儿">
            <el-select v-model="formInline.Surgical_delivery" placeholder="手术产儿">
              <el-option
                  v-for="item in Default.Surgical_delivery"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

             <el-form-item label="新生儿期死亡">
            <el-select v-model="formInline.Neonatal_death" placeholder="新生儿期死亡">
              <el-option
                  v-for="item in Default.Neonatal_death"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

             <el-form-item label="双胎或多胎">
            <el-select v-model="formInline.Twin_or_multiple" placeholder="双胎或多胎">
              <el-option
                  v-for="item in Default.Twin_or_multiple"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          </div>


          <div class="next">
            <el-button type="success" @click="onNext('four')">上一步</el-button>
            <el-button type="success" @click="onSubmit">确认完成</el-button>
          </div>

        </el-form>
      </el-tab-pane>
    </el-tabs>
  </div>

</template>

<script setup>
import { Edit, CirclePlus, Search, Expand,  } from '@element-plus/icons-vue'
import {defineComponent, onMounted, ref, watch, reactive} from 'vue'
import Drawer from './common/Drawer.vue';
import Header from './common/Header.vue';
import {ElMessage} from "element-plus";
import {useRoute, useRouter} from "vue-router"
import zhCn from'element-plus/lib/locale/lang/zh-cn'
import * as api from "../api/loginHttp";
import {archivesAdd} from "../api/loginHttp";

const activeName = ref('one')
const router = useRouter()
const route = useRoute()
const ids = ref()
const labName = ref()

const formInline = ref(          {
  guardian_mobile : '',
  sex : '男',
  birth : '',
  Apgar_score:'',
  username : '',
  Surgical_delivery:'',
  weight: '',
  touwei: '',
  height:'',
  guardian_name:'',
  chushengtz:'',
  childbearing_age:'',
  chushengsg:'',
  fuwei:'',
  xuexing_value:'',
  minzu_value:'',
  high_risk:'',
  guanxi_value:'',
  Infected:'',
  jiaoyu_value:'',
  birthSituation_value:'',
  Neonatal_death:'',
  Twin_or_multiple:'',
  birth_weight:'',
  Gigantic:'',
  Bad_value:[],
  disease_value:[],
  hair_value:[],
  eye_value:[],
  skin_value:[],
  oralCavity_value:[],
  tooth_value:[],
  neck_value:[],
  Neuropathy_value:[],
  symptoms_value:[],
  Phenylketonuria:[],
  sign_value:[],
  bones_value:[],
  history:'',
  feed_value:'母乳喂养',
  BreastfeedingVolume:'',
  milkPowder_value:[],
  milkPowderVolume:'',
  allergy_value:[],
  intolerance_value:[],
  one_motion_value:[],
  two_motion_value:[],
  three_motion_value:[],
  group_id:'',
})

watch(formInline, () => {
  console.log('user', formInline.value.feed_value)
})

const Default = reactive({
  Phenylketonuria:[
      {
      value: '苯丙酮尿症',
      label: '苯丙酮尿症'
    }
  ],
  relation: [
    {
      value: '父亲',
      label: '父亲'
    },
    {
      value: '母亲',
      label: '母亲'

    },
    {
      value: '其他',
      label: '其他'
    },
  ],
  Twin_or_multiple:[
 {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  Neonatal_death:[
  {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  Surgical_delivery:[
  {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  high_risk:[
    {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  Infected:[
    {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  Gigantic:[
   {
      value: '是',
      label: '是'

    },
    {
      value: '否',
      label: '否'
    },
  ],
  bloodGroup: [
    {
      value: 'A型',
      label: 'A型'
    },
    {
      value: 'B型',
      label: 'B型'
    },
    {
      value: 'AB型',
      label: 'AB型'
    },
    {
      value: 'O型',
      label: 'O型'
    },
    {
      value: 'ABO型',
      label: 'ABO型'
    },
    {
      value: 'Rh型',
      label: 'Rh型'
    },
  ],
  education: [
    {
      value: '博士',
      label: '博士'
    },
    {
      value: '硕士',
      label: '硕士'
    },
    {
      value: '本科',
      label: '本科'
    },
    {
      value: '大专',
      label: '大专'
    },
    {
      value: '高中',
      label: '高中'
    },
    {
      value: '初中及以下',
      label: '初中及以下'
    },
  ],
  nation: [
    {
      value: '汉族',
      label: '汉族'
    },
    {
      value: '壮族',
      label: '壮族'
    },
    {
      value: '满族',
      label: '满族'
    },
    {
      value: '回族',
      label: '回族'
    },
    {
      value: '苗族',
      label: '苗族'
    },
    {
      value: '维吾尔族',
      label: '维吾尔族'
    },
    {
      value: '土家族',
      label: '土家族'
    },
    {
      value: '彝族',
      label: '彝族'
    },
    {
      value: '蒙古族',
      label: '蒙古族'
    },
    {
      value: '藏族',
      label: '藏族'
    },
    {
      value: '布依族',
      label: '布依族'
    },
    {
      value: '侗族',
      label: '侗族'
    },
    {
      value: '瑶族',
      label: '瑶族'
    },
    {
      value: '朝鲜族',
      label: '朝鲜族'
    },
    {
      value: '白族',
      label: '白族'
    },
    {
      value: '哈尼族',
      label: '哈尼族'
    },
    {
      value: '哈萨克族',
      label: '哈萨克族'
    },
    {
      value: '黎族',
      label: '黎族'
    },
    {
      value: '傣族',
      label: '傣族'
    },
    {
      value: '畲族',
      label: '畲族'
    },
    {
      value: '傈僳族',
      label: '傈僳族'
    },
    {
      value: '仡佬族',
      label: '仡佬族'
    },
    {
      value: '东乡族',
      label: '东乡族'
    },
    {
      value: '高山族',
      label: '高山族'
    },
    {
      value: '拉祜族',
      label: '拉祜族'
    },
    {
      value: '水族',
      label: '水族'
    },
    {
      value: '佤族',
      label: '佤族'
    },
    {
      value: '纳西族',
      label: '纳西族'
    },
    {
      value: '羌族',
      label: '羌族'
    },
    {
      value: '土族',
      label: '土族'
    },
    {
      value: '仫佬族',
      label: '仫佬族'
    },
    {
      value: '锡伯族',
      label: '锡伯族'
    },
    {
      value: '柯尔克孜族',
      label: '柯尔克孜族'
    },
    {
      value: '达斡尔族',
      label: '达斡尔族'
    },
    {
      value: '景颇族',
      label: '景颇族'
    },
    {
      value: '毛南族',
      label: '毛南族'
    },
    {
      value: '撒拉族',
      label: '撒拉族'
    },
    {
      value: '布朗族',
      label: '布朗族'
    },
    {
      value: '塔吉克族',
      label: '塔吉克族'
    },
    {
      value: '阿昌族',
      label: '阿昌族'
    },
    {
      value: '普米族',
      label: '普米族'
    },
    {
      value: '鄂温克族',
      label: '鄂温克族'
    },
    {
      value: '怒族',
      label: '怒族'
    },
    {
      value: '京族',
      label: '京族'
    },
    {
      value: '基诺族',
      label: '基诺族'
    },
    {
      value: '德昂族',
      label: '德昂族'
    },
    {
      value: '保安族',
      label: '保安族',
    },
    {
      value: '俄罗斯族',
      label: '俄罗斯族',
    },
    {
      value: '裕固族',
      label: '裕固族',
    },
    {
      value: '乌孜别克族',
      label: '乌孜别克族',
    },
    {
      value: '门巴族',
      label: '门巴族',
    },
    {
      value: '鄂伦春族',
      label: '鄂伦春族',
    },
    {
      value: '独龙族',
      label: '独龙族',
    },
    {
      value: '塔塔尔族',
      label: '塔塔尔族',
    },
    {
      value: '赫哲族',
      label: '赫哲族',
    },
    {
      value: '珞巴族',
      label: '珞巴族',
    },
  ],
  birthSituation: [
    {
      value: '正常',
      label: '正常'
    },
    {
      value: '早产儿',
      label: '早产儿'
    },
    {
      value: '巨大儿',
      label: '巨大儿'
    },
    {
      value: '低体重儿',
      label: '低体重儿'
    },
    {
      value: '双胎/多胎',
      label: '双胎/多胎'
    },
  ],
  Bad: [
    {
      value: '饮酒',
      label: '饮酒'
    },
    {
      value: '吸烟',
      label: '吸烟'
    },
    {
      value: '素食',
      label: '素食'
    },
  ],
  disease: [
    {
      value: '妊娠期糖尿病',
      label: '妊娠期糖尿病'
    },
    {
      value: '妊娠期高血压',
      label: '妊娠期高血压'
    },
    {
      value: '维生素D缺乏',
      label: '维生素D缺乏'
    },
    {
      value: '维生素A缺乏',
      label: '维生素A缺乏'
    },
    {
      value: '缺锌',
      label: '缺锌'
    },
    {
      value: '缺铁性贫血',
      label: '缺铁性贫血'
    },
  ],
  hair: [
    {
      value: '细软',
      label: '细软'
    },
    {
      value: '稀少',
      label: '稀少'
    },
    {
      value: '变脆',
      label: '变脆'
    },
    {
      value: '易脱落',
      label: '易脱落'
    },
    {
      value: '环形脱发',
      label: '环形脱发'
    },
    {
      value: '干燥',
      label: '干燥'
    },
    {
      value: '枕秃',
      label: '枕秃'
    },
  ],
  eye:[
    {
      value: '夜盲症或者暗适应降低',
      label: '夜盲症或者暗适应降低'
    },
    {
      value: '眼睛外侧角发湿发红',
      label: '眼睛外侧角发湿发红'
    },
    {
      value: '怕光、烟雾或尘埃刺激',
      label: '怕光、烟雾或尘埃刺激'
    },
    {
      value: '结膜干燥',
      label: '结膜干燥'
    },
    {
      value: '角膜干燥',
      label: '角膜干燥'
    },
    {
      value: '结膜血管充血',
      label: '结膜血管充血'
    },
  ],
  skin:[
    {
      value: '皮肤干燥、脱屑',
      label: '皮肤干燥、脱屑'
    },
    {
      value: '皮肤创伤不易愈合',
      label: '皮肤创伤不易愈合'
    },
    {
      value: '面色苍白',
      label: '面色苍白'
    },
    {
      value: '指（趾）甲缺乏光泽、变薄、脆而易折、出现直的条纹状隆起',
      label: '指（趾）甲缺乏光泽、变薄、脆而易折、出现直的条纹状隆起'
    },
    {
      value: '指（趾）甲变平或反甲',
      label: '指（趾）甲变平或反甲'
    },
    {
      value: '脂溢性皮炎',
      label: '脂溢性皮炎'
    },
  ],
  oralCavity:[
    {
      value: '口角炎',
      label: '口角炎'
    },
    {
      value: '舌色变化：牛肉的鲜红色',
      label: '舌色变化：牛肉的鲜红色'
    },
    {
      value: '舌色变化：紫红色',
      label: '舌色变化：紫红色'
    },
    {
      value: '反复口腔溃疡',
      label: '反复口腔溃疡'
    },
  ],
  tooth:[
    {
      value: '婴儿出牙晚',
      label: '婴儿出牙晚'
    },
    {
      value: '牙龈出血',
      label: '牙龈出血'
    },
  ],
  neck:[
    {
      value: '甲状腺增生肥大',
      label: '甲状腺增生肥大'
    },
  ],
  Neuropathy:[
    {
      value: '末梢神经炎',
      label: '末梢神经炎'
    },
    {
      value: '周围神经变性',
      label: '周围神经变性'
    },
  ],
  symptoms:[
    {
      value: '伴有疲乏无力、倦怠、烦躁不安、易激动等',
      label: '伴有疲乏无力、倦怠、烦躁不安、易激动等'
    },
    {
      value: '表情冷漠或情绪不好',
      label: '表情冷漠或情绪不好'
    },
    {
      value: '神经异常（如）多疑、抑郁、嗜睡和癔症等',
      label: '神经异常（如）多疑、抑郁、嗜睡和癔症等'
    },
  ],
  sign:[
    {
      value: '幼儿消瘦',
      label: '幼儿消瘦'
    },
    {
      value: '水肿',
      label: '水肿'
    },
    {
      value: '儿童体重降低',
      label: '儿童体重降低'
    },
    {
      value: '生长发育迟缓或停止',
      label: '生长发育迟缓或停止'
    },
    {
      value: '儿童皮下脂肪减少或消失',
      label: '儿童皮下脂肪减少或消失'
    },
  ],
  bones:[
    {
      value: '儿童O或者X型腿',
      label: '儿童O或者X型腿'
    },
    {
      value: '幼儿佝偻病',
      label: '幼儿佝偻病'
    },
  ],
  feed:[
    {
      value: '母乳喂养',
      label: '母乳喂养'
    },
    {
      value: '人工喂养',
      label: '人工喂养'
    },
    {
      value: '混合喂养',
      label: '混合喂养'
    },
  ],
  milkPowder: [
    {
      value: '诺优能',
      label: '诺优能'
    },
    {
      value: '爱他美',
      label: '爱他美'
    },
    {
      value: '喜宝',
      label: '喜宝'
    },
    {
      value: '雅培',
      label: '雅培'
    },
    {
      value: '惠氏',
      label: '惠氏'
    },
    {
      value: '雀巢',
      label: '雀巢'
    },
    {
      value: '美赞臣',
      label: '美赞臣'
    },
    {
      value: '其他',
      label: '其他'
    },
  ],
  allergy:[
    {
      value: '鸡蛋',
      label: '鸡蛋'
    },
    {
      value: '牛奶',
      label: '牛奶'
    },
    {
      value: '花生',
      label: '花生'
    },
    {
      value: '大豆',
      label: '大豆'
    },
    {
      value: '大麦',
      label: '大麦'
    },
    {
      value: '小麦',
      label: '小麦'
    },
    {
      value: '坚果',
      label: '坚果'
    },
    {
      value: '鱼',
      label: '鱼'
    },
    {
      value: '虾',
      label: '虾'
    },
  ],
  intolerance:[
    {
      value: '乳糖',
      label: '乳糖'
    },
    {
      value: '鸡蛋',
      label: '鸡蛋'
    },
  ],
  one_motion:[
    {
      value: '正常活动，喜欢蹦跳（爱哭闹）',
      label: '正常活动，喜欢蹦跳（爱哭闹）'
    },
    {
      value: '平常较安静，活动量不大',
      label: '平常较安静，活动量不大'
    },
  ],
  two_motion:[
    {
      value: '活泼好动',
      label: '活泼好动'
    },
    {
      value: '比较安静，活动量不大',
      label: '比较安静，活动量不大'
    },
  ],
  three_motion:[
    {
      value: '大量运动',
      label: '大量运动'
    },
    {
      value: '中等运动量',
      label: '中等运动量'
    },
    {
      value: '少量运动',
      label: '少量运动'
    },
  ],
})


const fetchData = async () => {
  if(route.params.groupId) {
    ids.value = route.params.groupId
    if (ids.value == 3) {
      labName.value = '婴幼儿营养测评'
    } else if (ids.value == 5) {
      labName.value = '孕产妇营养测评'
    } else if (ids.value == 6) {
      labName.value = '成年人营养测评'
    } else if (ids.value == 7) {
      labName.value = '慢性病营养测评'
    } else if (ids.value == 8) {
      labName.value = '团体营养测评'
    }
    formInline.value.group_id = route.params.groupId;

    let url = "ws://localhost:";
    let ws = null;
    let isConnected = false;
    let port = 18003;
    if (isConnected)
      return;
    let fullUrl = url + port;
    port = (port == 18003 ? 18004 : 18003);
    if ("WebSocket" in window) {
      ws = new WebSocket(fullUrl);
    }else if ("MozWebSocket" in window) {
      ws = new MozWebSocket(fullUrl);
    } else {
      //show_status("red","浏览器不支持WebSocket");
      ElMessage.error('浏览器不支持WebSocket，请手动输入')

    }
    ws.onopen = function () {
      isConnected = true;
    }
    ws.onmessage = function (msg) {
      let data = msg.data.split(',');
      let status = data[0];
      formInline.value.weight = data[4];
      formInline.value.height = data[5];
      if (status == "0") {
        console.log('设备断开连接')
      }
      else if (status == "1") {
        console.log('设备已连接')
      }
      else if (status == "2") {
        console.log('设备已连接')
      }
      else if (status == "128") {
      }
      else if (status == "512") {
      }

    }

  } else {
    ElMessage.error('栏目编号不得为空')
    await router.push({'path': '/Home'})
  }
}

const  onSubmit = async () =>{
  if(
      formInline.value.guardian_mobile==''
      || formInline.value.username==''
      || formInline.value.height==''
      || formInline.value.sex==''
      || formInline.value.weight==''
      || formInline.value.guardian_name==''
      || formInline.value.birth==''
      || formInline.value.touwei==''
  ){
    ElMessage.error('必填项不能为空')
    onNext('one')
    return false;
  }
  let params = formInline._rawValue

  const res = await api.archivesAdd(params);

  if(res.data.code === 1) {
    ElMessage.success(res.data.msg)
    await router.push({'path': '/pageList/' +formInline.value.group_id})
  } else {
    ElMessage.error(res.data.msg)
  }


}
const onHome = async () => {
  await router.push({'path': '/Home'})
}
const pageList = async () => {
  await router.push({'path': '/pageList/' + ids.value})
}
const onNext =  (type) => {
   activeName.value = type
}

//自动加载
onMounted(() => {
  fetchData()
})

</script>

<style scoped>
.tabInfo .el-tabs {
  width: 80%;
  margin-top: 40px;
  margin-left: 120px;

}
/deep/ .el-form-item__content .el-input-group {
  vertical-align: top;
  width: 202px;
}

.tabInfo{
  width: 100%;
}
.one{
  padding: 7px 10px;
  margin-right: 5px;
  box-sizing: border-box;
  float: left;
  font-weight: 500;
  font-size: 14px;
  color: #606266;
  cursor: pointer;
}
::v-deep .el-tabs__content {
  margin-left: 5%;
}

::v-deep .el-form-item__label {
  width: 110px;
}
::v-deep .el-form {
  margin: 20px;
}

::v-deep .el-input--prefix .el-input__inner{
  border: 1px solid #ececec;
  width: 202px;
  height: 40px;
  font-size: 14px;
  line-height: 40px;
  border-radius: 2px;
}

.next {
  width: 100%;
  text-align: center;
  padding: 20px 0px;
}
::v-deep .el-input--suffix {
  width: 202px;
}

::v-deep .el-radio-group {
  width: 202px;
}
::v-deep .el-button--success{
  background: #2AB28B;
}
</style>
